<template>
	<view class="order_tracker">
		
<view class="title">
	{{company}} {{express_num}}
</view>		




<view class="content">

	<uni-load-more  v-if="lists.length === 0" status="loading" showIcon="true" ></uni-load-more>
	<uni-steps v-if="lists.length > 0"  :options="lists" direction="column" ></uni-steps>	
		
</view>	


		
		
		
	</view>
</template>

<script>
	
	import uniSteps from '@/components/uni-steps/uni-steps.vue'
	import uniLoadMore from "@/components/uni-load-more/uni-load-more.vue"

	
	export default {
		components: {uniSteps, uniLoadMore},
		data() {
			return {
				lists: [],
				company: '',
				express_num: "",
				loading : ''
			};
		},
		onLoad(options) {
			
			
			// this.options.order_id
			this.loadLists(options.order_id)
			
		},
		methods: {
			loadLists(order_id) {
				
				this.$http.post('/shop.order/order_track', { order_id: order_id }).then(res => {
				  
				  
				  if (res.data.data != null) {
					  
					  
					  let that = this
					  
				    res.data.data.lists.map(function(item, index){
						
						//console.log(item)
						
						that.lists.push({
							'title':item['remark'],
							'desc':item['datetime']							
						})						 
						
					});
					
					console.log(that.lists)
					
				    this.company = res.data.data.company;
				    this.express_num = res.data.data.no;
					
				  } else {
				    this.loading = "该单号暂无物流进展，请稍后再试";
				    this.express_num = res.data.data.no;
				  }
				  
				  
				});
				
				
			}
		},
	}
</script>

<style lang="scss">
	
	.order_tracker{
		height: 100%;
	}
	
.title{
	text-align: center;
	background-color: white;
	padding: 20rpx;
	line-height: 2;
	margin-bottom: 20rpx;
}
.content{
	background-color: white;
	padding: 20rpx;
	height: 100%;
}
</style>
